<!-- html5标准的文档类型 -->
<!DOCTYPE html>
<!-- zh-CN  en -->
<html lang="zh-CN">

<head>
  <!-- 编码方式 utf-8 -->
  <meta charset="utf-8">
  <!-- 使用最新的ie标准 或者 模式 来渲染我们的页面 -->
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <!-- 适配 移动端  -->
  <meta name="viewport"
    content="width=device-width, initial-scale=1,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">
  <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
  <title>微金所</title>

  <!-- Bootstrap -->
  <!-- 加载 bootstrap 核心样式表 -->
  <link href="./lib/bootstrap/css/bootstrap.min.css" rel="stylesheet">
  <!-- 引入我们的字体样式文件 -->
  <link rel="stylesheet" href="./css/base.css">
  <!-- 引入我们自己的样式表 -->
  <link rel="stylesheet" href="./css/index.css">
  <!-- HTML5 shim 和 Respond.js 是为了让 IE8 支持 HTML5 元素和媒体查询（media queries）功能 -->
  <!-- 警告：通过 file:// 协议（就是直接将 html 页面拖拽到浏览器中）访问页面时 Respond.js 不起作用 -->
  <!-- lt less then -->
  <!--[if lt IE 9]>
      <script src="./lib/html5shiv/html5shiv.min.js"></script>
      <script src="./lib/respond/respond.min.js"></script>
    <![endif]-->
</head>

<body>
  <!-- 头部开始 -->
  <header class="wjs_header hidden-xs hidden-sm">
    <div class="container">
      <div class="row">
        <div class="col-md-2 wjs_code">
          <!-- 第一个类 说明用的是那个字体 第二个类是这个字体里面的那个字 -->
          <span class="wjs_icon wjs_icon_phone"></span>
          <span>手机微金所</span>
          <span class="glyphicon glyphicon-menu-down"></span>
          <img src="./images/code.jpg" alt="">
        </div>
        <div class="col-md-5">
          <span class="wjs_icon wjs_icon_tel"></span>
          <a href="#">4006-89-4006（服务时间：9:00~21:00） 联系在线客服</a>
        </div>
        <div class="col-md-2">
          <a href="#">常见问题</a>&nbsp;&nbsp;
          <a href="#">财富登录</a>
        </div>
        <div class="col-md-3">
          <button type="button" class="btn btn-danger">免费注册</button>
          <button type="button" class="btn btn-link">登录</button>
        </div>
      </div>
    </div>
  </header>
  <!-- 头部结束 -->

  <!-- 导航栏开始 -->
  <nav class="wjs_nav navbar navbar-default">
      <div class="container">
        <!-- 在移动端更好的来展示 开关 品牌内容 -->
        <!-- Brand and toggle get grouped for better mobile display -->
        <div class="navbar-header">
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
            <!-- 在屏幕阅读器里面显示 -->
            <span class="sr-only">Toggle navigation</span>
            <!-- 按钮上 横线个数 -->
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        
          </button>
          <a class="navbar-brand" href="#">
            <span class="wjs_icon wjs_icon_logo"></span>
            <span class="wjs_icon wjs_icon_text"></span>
          </a>
        </div>
        <!-- 导航里的连接，表单和其他内容 -->
        <!-- Collect the nav links, forms, and other content for toggling -->
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
          <ul class="nav navbar-nav hidden-sm">
            <li class="active"><a href="#">我要投资 <span class="sr-only">(current)</span></a></li>
            <li><a href="#">我要借贷</a></li>
            <li><a href="#">平台介绍</a></li>
            <li><a href="#">新手专区</a></li>
            <li><a href="#">最新动态</a></li>
            <li><a href="#">微平台</a></li>
            <!-- 下拉菜单 -->
            <!--     <li class="dropdown">
              <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a>
              <ul class="dropdown-menu">
                <li><a href="#">Action</a></li>
                <li><a href="#">Another action</a></li>
                <li><a href="#">Something else here</a></li>
                <li role="separator" class="divider"></li>
                <li><a href="#">Separated link</a></li>
                <li role="separator" class="divider"></li>
                <li><a href="#">One more separated link</a></li>
              </ul>
            </li> -->
          </ul>
          <!-- 表单 -->
       <!--    <form class="navbar-form navbar-left">
            <div class="form-group">
              <input type="text" class="form-control" placeholder="Search">
            </div>
            <button type="submit" class="btn btn-default">Submit</button>
          </form> -->
          <ul class="nav navbar-nav navbar-right">
            <li><a href="#">个人中心</a></li>
            <!-- 下拉菜单 -->
            <!-- <li class="dropdown">
              <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a>
              <ul class="dropdown-menu">
                <li><a href="#">Action</a></li>
                <li><a href="#">Another action</a></li>
                <li><a href="#">Something else here</a></li>
                <li role="separator" class="divider"></li>
                <li><a href="#">Separated link</a></li>
              </ul>
            </li> -->
          </ul>
        </div>
      </div>
  </nav>
  <!-- 导航栏技术 -->

  <!-- 轮播图开始 -->
  <div class="wjs_banner">
    <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
      <!-- Indicators 指示器  就是轮播图中间的小圆点-->
      <ol class="carousel-indicators">
        <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
        <li data-target="#carousel-example-generic" data-slide-to="1"></li>
        <li data-target="#carousel-example-generic" data-slide-to="2"></li>
        <li data-target="#carousel-example-generic" data-slide-to="3"></li>
      </ol>
    
      <!-- Wrapper for slides 就是 轮播图里面的 图片容器 -->
      <div class="carousel-inner" role="listbox">
        <div class="item active" data-small-img="./images/slide_01_640x340.jpg" data-big-img="./images/slide_01_2000x410.jpg">
        </div>
        <div class="item" data-small-img="./images/slide_02_640x340.jpg" data-big-img="./images/slide_02_2000x410.jpg">
        </div>
        <div class="item" data-small-img="./images/slide_03_640x340.jpg" data-big-img="./images/slide_03_2000x410.jpg">
        </div>
        <div class="item" data-small-img="./images/slide_04_640x340.jpg" data-big-img="./images/slide_04_2000x410.jpg">
        </div>
      </div>
    
      <!-- Controls 左右箭头 -->
      <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
        <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
        <span class="sr-only">Previous</span>
      </a>
      <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
        <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
        <span class="sr-only">Next</span>
      </a>
    </div>
  </div>
  <!-- 轮播图结束 -->

  <!-- 信息开始 -->
  <div class="wjs_info hidden-xs">
    <div class="container">
      <div class="row">
        <div class="col-sm-6 col-md-4">
          <a href="#">
            <div class="media">
              <span class="media-left wjs_icon wjs_icon_E900"></span>
              <div class="media-body">
                <h4 class="media-heading">支持交易保障</h4>
                <p>银联支持全程保障支持安全</p>
              </div>
            </div>
          </a>
        </div>
        <div class="col-sm-6 col-md-4">
          <a href="#">
            <div class="media">
              <span class="media-left wjs_icon wjs_icon_E900"></span>
              <div class="media-body">
                <h4 class="media-heading">支持交易保障</h4>
                <p>银联支持全程保障支持安全</p>
              </div>
            </div>
          </a>
        </div>
        <div class="col-sm-6 col-md-4">
          <a href="#">
            <div class="media">
              <span class="media-left wjs_icon wjs_icon_E900"></span>
              <div class="media-body">
                <h4 class="media-heading">支持交易保障</h4>
                <p>银联支持全程保障支持安全</p>
              </div>
            </div>
          </a>
        </div>
        <div class="col-sm-6 col-md-4">
          <a href="#">
            <div class="media">
              <span class="media-left wjs_icon wjs_icon_E900"></span>
              <div class="media-body">
                <h4 class="media-heading">支持交易保障</h4>
                <p>银联支持全程保障支持安全</p>
              </div>
            </div>
          </a>
        </div>
        <div class="col-sm-6 col-md-4">
          <a href="#">
            <div class="media">
              <span class="media-left wjs_icon wjs_icon_E900"></span>
              <div class="media-body">
                <h4 class="media-heading">支持交易保障</h4>
                <p>银联支持全程保障支持安全</p>
              </div>
            </div>
          </a>
        </div>
        <div class="col-sm-6 col-md-4">
          <a href="#">
            <div class="media">
              <span class="media-left wjs_icon wjs_icon_E900"></span>
              <div class="media-body">
                <h4 class="media-heading">支持交易保障</h4>
                <p>银联支持全程保障支持安全</p>
              </div>
            </div>
          </a>
        </div>
      </div>
    </div>
  </div>
  <!-- 信息结束 -->

  <!-- 预约开始 -->
  <div class="wjs_order hidden-xs">
    <div class="container">
      <div class="row">
        <div class="col-sm-9">
          <span class="wjs_icon wjs_icon_E906"></span>
          现在的 272 人在排队，累计预约交易成功 7571 次  
          <a href="#">什么叫预约投标</a>
          <a href="#" class="wjs_order_now">立即预约</a>
        </div>
        <div class="col-sm-3">
          <span class="wjs_icon wjs_icon_E905"></span>
          <a href="#">微金所企业宣传片</a>
        </div>
      </div>
    </div>
  </div>
  <!-- 预约结束 -->

  <!-- 产品开始 -->
  <div class="wjs_products">
    <div class="container">
      <div id="wjs_nav_parent">
      <!-- 标签页导航 -->
        <ul class="nav nav-tabs" role="tablist">
          <li role="presentation" class="active">
            <!--  href="#home" 锚链接 -->
            <a href="#p1" aria-controls="p1" role="tab" data-toggle="tab">特别推荐</a>
          </li>
          <li role="presentation">
            <a href="#p2" aria-controls="p2" role="tab" data-toggle="tab">微投资</a>
          </li>
          <li role="presentation">
            <a href="#p3" aria-controls="p3" role="tab" data-toggle="tab">微小宝</a>
          </li>
          <li role="presentation">
            <a href="#p4" aria-controls="p4" role="tab" data-toggle="tab">月月盈</a>
          </li>
          <li role="presentation">
            <a href="#p5" aria-controls="p5" role="tab" data-toggle="tab">稳赢宝</a>
          </li>
          <li role="presentation">
            <a href="#p6" aria-controls="p6" role="tab" data-toggle="tab">海航通宝</a>
          </li>
          <li role="presentation">
            <a href="#p7" aria-controls="p7" role="tab" data-toggle="tab">微金宝</a>
          </li>
        </ul>
    </div>
      <!-- 标签页对应的内容 -->
      <div class="tab-content">
        <div role="tabpanel" class="tab-pane active" id="p1">
          <div class="container">
            <div class="row">
              <div class="col-xs-12 col-sm-6 col-md-4">
                <div class="pBox active">
                  <div class="pLeft">
                    <h4 class="wjs_p_title">新手体验1002期</h4>
                    <div class="row">
                      <div class="col-xs-6">
                        <p>起投金额(元)</p>
                        <p>0.01万</p>
                      </div>
                      <div class="col-xs-6">
                        <p>起投金额(元)</p>
                        <p>0.01万</p>
                      </div>
                      <div class="col-xs-6">
                        <p>起投金额(元)</p>
                        <p>0.01万</p>
                      </div>
                      <div class="col-xs-6">
                        <p>起投金额(元)</p>
                        <p>0.01万</p>
                      </div>
                    </div>

                  </div>
                  <div class="pRight">
                    <span>8</span>
                    <sub>%</sub>
                    <p>年利率</p>
                  </div>
                </div>
              </div>
              <div class="col-xs-12 col-sm-6 col-md-4">
                <div class="pBox">
                  <div class="pLeft">
                    <h4 class="wjs_p_title">新手体验1002期</h4>
                    <div class="row">
                      <div class="col-xs-6">
                        <p>起投金额(元)</p>
                        <p>0.01万</p>
                      </div>
                      <div class="col-xs-6">
                        <p>起投金额(元)</p>
                        <p>0.01万</p>
                      </div>
                      <div class="col-xs-6">
                        <p>起投金额(元)</p>
                        <p>0.01万</p>
                      </div>
                      <div class="col-xs-6">
                        <p>起投金额(元)</p>
                        <p>0.01万</p>
                      </div>
                    </div>

                  </div>
                  <div class="pRight">
                   <div class="wjs_tips">
                    <!-- <span>宝</span> -->
                    <span   data-toggle="tooltip" data-placement="top" title="微金宝">宝</span>
                    <span   data-toggle="tooltip" data-placement="top" title="北京市">北</span>
                    <!-- <span>北</span> -->
                   </div>
                    <span>8</span>
                    <sub>%</sub>
                    <p>年利率</p>
                  </div>
                </div>
              </div>
              <div class="col-xs-12 col-sm-6 col-md-4">
                <div class="pBox">
                  <div class="pLeft">
                    <h4 class="wjs_p_title">新手体验1002期</h4>
                    <div class="row">
                      <div class="col-xs-6">
                        <p>起投金额(元)</p>
                        <p>0.01万</p>
                      </div>
                      <div class="col-xs-6">
                        <p>起投金额(元)</p>
                        <p>0.01万</p>
                      </div>
                      <div class="col-xs-6">
                        <p>起投金额(元)</p>
                        <p>0.01万</p>
                      </div>
                      <div class="col-xs-6">
                        <p>起投金额(元)</p>
                        <p>0.01万</p>
                      </div>
                    </div>

                  </div>
                  <div class="pRight">
                    <span>8</span>
                    <sub>%</sub>
                    <p>年利率</p>
                  </div>
                </div>
              </div>
              <div class="col-xs-12 col-sm-6 col-md-4">
                <div class="pBox">
                  <div class="pLeft">
                    <h4 class="wjs_p_title">新手体验1002期</h4>
                    <div class="row">
                      <div class="col-xs-6">
                        <p>起投金额(元)</p>
                        <p>0.01万</p>
                      </div>
                      <div class="col-xs-6">
                        <p>起投金额(元)</p>
                        <p>0.01万</p>
                      </div>
                      <div class="col-xs-6">
                        <p>起投金额(元)</p>
                        <p>0.01万</p>
                      </div>
                      <div class="col-xs-6">
                        <p>起投金额(元)</p>
                        <p>0.01万</p>
                      </div>
                    </div>

                  </div>
                  <div class="pRight">
                    <span>8</span>
                    <sub>%</sub>
                    <p>年利率</p>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div role="tabpanel" class="tab-pane" id="p2">2</div>
        <div role="tabpanel" class="tab-pane" id="p3">3</div>
        <div role="tabpanel" class="tab-pane" id="p4">4</div>
        <div role="tabpanel" class="tab-pane" id="p5">5</div>
        <div role="tabpanel" class="tab-pane" id="p6">6</div>
        <div role="tabpanel" class="tab-pane" id="p7">7</div>
      </div>
    
    </div>
  </div>
  <!-- 产品结束 -->

  <!-- 新闻开始 -->
  <div class="wjs_news">
    <div class="container">
      <div class="row">
        <div class="col-md-2 col-md-offset-2">
          <h3 class="wjs_news_title">全部新闻</h3>
        </div>
        <div class="col-md-1 wjs_news_line_parent">
          <div class="wjs_news_line hidden-xs hidden-sm"></div>
          <ul class="nav nav-tabs" role="tablist">
            <li role="presentation" class="active"><a href="#home" aria-controls="home" role="tab" data-toggle="tab">
              <span class="wjs_icon wjs_icon_new01"></span>
            </a></li>
            <li role="presentation"><a href="#profile" aria-controls="profile" role="tab" data-toggle="tab">
              <span class="wjs_icon wjs_icon_new02"></span>
            </a></li>
            <li role="presentation"><a href="#messages" aria-controls="messages" role="tab" data-toggle="tab">
              <span class="wjs_icon wjs_icon_new03"></span>
            </a></li>
            <li role="presentation"><a href="#settings" aria-controls="settings" role="tab" data-toggle="tab">
              <span class="wjs_icon wjs_icon_new04"></span>
            </a></li>
          </ul>
        </div>
        <div class="col-md-7">
          <div class="tab-content">
            <div role="tabpanel" class="tab-pane active" id="home">
              <ul class="wjs_news_list">
                <li><a href="#"><span class="hidden-xs">2020-04-09</span>【微公告】关于海航通宝22期项目募集期延长通知</a></li>
                <li><a href="#"><span class="hidden-xs">2020-04-09</span>【微动态】世纪佳缘与百合网的投资人首善财富董事长吴正新一行莅临微金所调研指导</a></li>
                <li><a href="#"><span class="hidden-xs">2020-04-09</span>【微动态】封面人物第六期 ▏万雅泉—— 手写心情的双鱼座美女</a></li>
                <li><a href="#"><span class="hidden-xs">2020-04-09</span>【微公告】2016年7月11日微金所平台系统升级维护公告</a></li>
                <li><a href="#"><span class="hidden-xs">2020-04-09</span>【微动态】微金所与前海航交所携手，正式推出安全优质的理财产品—海航金宝！</a></li>
                <li><a href="#"><span class="hidden-xs">2020-04-09</span>【微动态】微金所七月电脑节，激情狂欢理财好礼送不停！</a></li>
                <li><a href="#"><span class="hidden-xs">2020-04-09</span>【微还款】一周还款公告2016年7月11日-7月17日</a></li>
              </ul>
            </div>
            <div role="tabpanel" class="tab-pane" id="profile">2</div>
            <div role="tabpanel" class="tab-pane" id="messages">3</div>
            <div role="tabpanel" class="tab-pane" id="settings">4</div>
          </div>
        </div>
      </div>
    </div>
  </div>
  <!-- 新闻结束 -->

  <!-- 合作伙伴开始 -->
  <div class="wjs_partner">
    <div class="container">
      <h3 class="wjs_partner_title">合作伙伴</h3>
      <ul class="wjs_partner_list">
        <li><a href="#" class="wjs_icon wjs_icon_partner01"></a></li>
        <li><a href="#" class="wjs_icon wjs_icon_partner02"></a></li>
        <li><a href="#" class="wjs_icon wjs_icon_partner03"></a></li>
        <li><a href="#" class="wjs_icon wjs_icon_partner04"></a></li>
        <li><a href="#" class="wjs_icon wjs_icon_partner05"></a></li>
        <li><a href="#" class="wjs_icon wjs_icon_partner06"></a></li>
        <li><a href="#" class="wjs_icon wjs_icon_partner07"></a></li>
        <li><a href="#" class="wjs_icon wjs_icon_partner08"></a></li>
        <li><a href="#" class="wjs_icon wjs_icon_partner09"></a></li>
      </ul>
    </div>
  </div>
  <!-- 合作伙伴结束 -->












  <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
  <script src="./lib/jquery/jquery-3.4.1.min.js"></script>
  <!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
  <script src="./lib/bootstrap/js/bootstrap.min.js"></script>
  <!-- 加载第三方滚动插件 -->
  <script src="./lib/iscroll/iscroll.js"></script>
  <!-- 引入轮播图js文件 -->
  <script src="./js/index.js"></script>
</body>

</html>